<style>
	.col{
		color: rgb(209,22,45);
	}
	.bbtitle{
		background:#fff !important;
		padding-left: 20px !important;
		padding-bottom: 4px !important;
		border-top: none !important;
		font-size: 16px;
		font-weight: 500;
	}
	.bboder{
		border: 1px solid #e8e8e8 !important;
		height: 60px;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-right: 16px !important;
	}
	.bbleft{
		width: 25%;
		text-align: center;
		border-right: 1px solid #e8e8e8;
		height: 100%;
		line-height: 60px;
		font-size: 14px;
		font-weight: 400;
	}
	.bbright{
		flex: 1;
		height: 100%;
		text-align: right;
		line-height: 60px;
	}
	.bbflex{
		display: flex;
		justify-content: space-between;
		padding-left: 16px !important;
	}
	.bboder_m{
		margin-bottom:0px !important;
		margin-top: 0px !important;
		/*border-bottom: none !important;*/
		border-top: none !important;
	}

	.bboder_t{
		border-top: none !important;
		margin-top: 0px !important;
	}
	.sty{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.sty div{
		height: 60px;
		flex: 1;
		border: 1px solid #e8e8e8;
		padding: 15px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.sty3{
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 0 !important;
	}
	.sty3 div{
		height: 59px;
		flex: 1;
		padding: 15px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.sty3_div_img{
		/*width: 60px;*/

	}
	.sty3 img{
		width: 60px;
		height: 40px;
	}
	.sty2{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
	.sty2 .divbox{
		width: 33.3%;
		height: 60px;
		border: 1px solid #e8e8e8;
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
	}
	.sty2 .divbox div{
		width: 50%;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
	}
	.sty2 .divbox .ffr{
		justify-content: flex-end !important;
		/*padding-right: 5px !important;*/
	}
	.sty2 img{
		width: 40px;
		height: 40px;
		margin-right: 5px;
	}
	.sty2 span{
		width: 60px;
		height: 30px;
		margin-right: 5px;
		text-align: center;
		line-height: 30px;
	}
	.sty2 .span1{
		background:rgb(196,24,45);
		border-radius: 85px;
		font-weight: bold;
		color: #fff;
	}
	.sty2 .span2{
		background:rgb(196,24,45);
		border-radius: 5px;
		font-weight: bold;
		color: #fff;
	}
	.sty2 .span3{
		border:1px solid rgb(196,24,45);
		border-radius: 85px;
		font-weight: bold;
		color: rgb(196,24,45);
	}
	.sty2 .span4{
		border:1px solid rgb(196,24,45);
		border-radius: 5px;
		font-weight: bold;
		color: rgb(196,24,45);
	}
	.sty .action,.sty2 .action{
		border-color: #e84c3d;
		background: rgb(243,209,213);
		color:#e84c3d;
	}
	.sty3 .action{
		border:1px solid #e84c3d;
		background: rgb(243,209,213);
		color:#e84c3d;
	}


</style>





<p style="background:rgb(196,24,45);color: #fff;font-size: 16px;font-weight: 500;">秒杀设置</p>


<ul class="basics_ul">
	<p class="bbtitle">商品管理</p>
	<li class="bboder">
		<div class="bbleft">商品选择</div>
		<div class="bbright">
			<label class="mr30">
				<input type="radio" ng-model="content.data_type" value="1" name="data_tyle" /><span>默认数据</span>
			</label>
			<label>
				<input type="radio" ng-model="content.data_type" value="2" name="data_tyle" /><span>手动选择</span>
			</label>
		</div>
	</li>
	<div ng-if="content.data_type==2" style="padding-left: 10px;padding-right: 10px;">
<!--		<div>已选择<span style="color:rgba(255, 89, 64, 1) ">6</span>个商品，拖拽可进行排序</div>-->
		<ul ui-sortable="sortableOptions" style="background:rgb(247,236,249);text-align: left;margin: 0 ;" ng-model="content.data" class="goods_item" ng-if="content.data.length != 0">
			<div style="padding-left: 10px;padding-top: 10px;">已选择<span style="color:rgba(255, 89, 64, 1) ">6</span>个商品，拖拽可进行排序</div>
			<li ng-repeat="goods in content.data track by $index">
				<i class="goodsclose fa fa-times-circle" onclick="delgoods(this)"></i>
				<img src="{{goods.goodsimg}}" style="width: 100%;height: 100%;" />
				<span class="dis_vm"></span>
			</li>
		</ul>
		<a class="btn btn-sm btn-default m20 addgoods" onclick="add_group_skill(1)"><i class="fa fa-plus"></i>选择商品</a>
	</div>
	<p class="bbtitle">栏目属性</p>
	<li class="bboder" style="margin-bottom: 0px;">
		<div class="bbleft">栏目标题</div>
		<div class="bbright bbflex">
			<span ng-if="content.column_title">显示</span>
			<span class="col" ng-if="!content.column_title">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.column_title"  />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">栏目名称</div>
		<div class="bbright">
			<input type="text" ng-model="content.column_name" value="" maxlength="10"/>
		</div>
	</li>
	<li class="bboder bboder_t">
		<div class="bbleft">自定义标题</div>
		<div class="bbright" bbflex style="text-align: left;padding-left: 16px;">
			<img ng-if="content.column_diy_title==''" onclick="setuploadimg('','column_diy_title',this)" style="width: 40px;height: 40px;" src="/public/static/images/component/seckill/add.png">
			<img ng-if="content.column_diy_title" onclick="setuploadimg('','column_diy_title',this)" style="width: 40px;height: 40px;" src="{{content.column_diy_title}}">
			<sapn>请上传栏目样式推荐使用宽750像素的.png图片</sapn>
		</div>
	</li>
	<p class="bbtitle">商品属性</p>
	<li class="bboder" style="margin-bottom: 0px;">
		<div class="bbleft">商品名称</div>
		<div class="bbright bbflex">
			<span ng-if="content.trade_name">显示</span>
			<span class="col" ng-if="!content.trade_name">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.trade_name" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">商品价格</div>
		<div class="bbright bbflex">
			<span ng-if="content.commodity_price">显示</span>
			<span class="col" ng-if="!content.commodity_price">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.commodity_price" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">零售价格</div>
		<div class="bbright bbflex">
			<span ng-if="content.wholesale_price">显示</span>
			<span class="col" ng-if="!content.wholesale_price">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.wholesale_price" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">秒杀倒计时</div>
		<div class="bbright bbflex">
			<span ng-if="content.count_down">显示</span>
			<span class="col" ng-if="!content.count_down">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.count_down" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">已秒数量</div>
		<div class="bbright bbflex">
			<span ng-if="content.seconds_num">显示</span>
			<span class="col" ng-if="!content.seconds_num">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.seconds_num" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">剩余库存</div>
		<div class="bbright bbflex">
			<span ng-if="content.remaining_inventory">显示</span>
			<span class="col" ng-if="!content.remaining_inventory">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.remaining_inventory" />
			</label>
		</div>
	</li>
	<li class="bboder bboder_t" >
		<div class="bbleft">隐藏已售罄商品</div>
		<div class="bbright bbflex">
			<span ng-if="content.hide_sold_out_items">显示</span>
			<span class="col" ng-if="!content.hide_sold_out_items">隐藏</span>
			<label>
				<input type="checkbox" ng-model="content.hide_sold_out_items" />
			</label>
		</div>
	</li>
	<p class="bbtitle">样式设置</p>
	<li class="bboder" style="border-bottom: none !important;margin-bottom: 0;">
		<div class="bbleft">列表样式</div>
		<div class="bbright bbflex">
			<span>{{content.column_action_name[content.style-1]}}</span>
			<label></label>
		</div>
	</li>
	<li class="sty" style="margin-top: 0;">
		<div ng-class="{action:content.style==1}"  ng-click="set_style_new(1)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==1 ? 'a01.png':'01.png')}}"></div>
		<div ng-class="{action:content.style==2}"  ng-click="set_style_new(2)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==2 ? 'a02.png':'02.png')}}"></div>
		<div ng-class="{action:content.style==3}"  ng-click="set_style_new(3)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==3 ? 'a03.png':'03.png')}}"></div>
		<div ng-class="{action:content.style==4}"  ng-click="set_style_new(4)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==4 ? 'a04.png':'04.png')}}"></div>
		<div ng-class="{action:content.style==5}"  ng-click="set_style_new(5)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==5 ? 'a05.png':'05.png')}}"></div>
		<div ng-class="{action:content.style==6}"  ng-click="set_style_new(6)"><img ng-src="{{'/public/static/images/component/seckill/'+(content.style==6 ? 'a06.png':'06.png')}}"></div>
	</li>
	<li class="bboder" style="border-bottom: none !important;margin-bottom: 0;">
		<div class="bbleft">商品样式</div>
		<div class="bbright bbflex">
			<span>{{content.product_style_name[content.product_style-1]}}</span>
			<label></label>
		</div>
	</li>
	<li class="sty" style="margin-top: 0;">
		<div  ng-repeat="psn in content.product_style_name" ng-class="{action:content.product_style==($index+1)}" ng-click="set_product_style($index+1)" >{{psn}}</div>
	</li>
	<li class="bboder" style="border-bottom: none !important;margin-bottom: 0;">
		<div class="bbleft">购买按钮</div>
		<div class="bbright bbflex">
			<span>{{content.purchase_button_name[content.purchase_button-1]}}</span>
			<label></label>
		</div>
	</li>
	<li class=" sty2" style="margin-top: 0;">
		<div ng-class="{action:content.purchase_button==1}" ng-click="set_purchase_button(1)"  class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/01.png"></div><div>购物车1</div></div>
		<div ng-class="{action:content.purchase_button==2}" ng-click="set_purchase_button(2)"  class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/02.png"></div><div>购物车2</div></div>
		<div ng-class="{action:content.purchase_button==3}" ng-click="set_purchase_button(3)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/03.png"></div><div>空心加购</div></div>
		<div ng-class="{action:content.purchase_button==4}" ng-click="set_purchase_button(4)"  class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/04.png"></div><div>实心加购</div></div>
		<div ng-class="{action:content.purchase_button==5}" ng-click="set_purchase_button(5)"  class="divbox"><div class="ffr"><span class="span1">按钮</span></div><div>圆角实心</div></div>
		<div ng-class="{action:content.purchase_button==6}" ng-click="set_purchase_button(6)"  class="divbox"><div class="ffr"><span class="span2">按钮</span></div><div>半圆角实心</div></div>
		<div ng-class="{action:content.purchase_button==7}" ng-click="set_purchase_button(7)"  class="divbox"><div class="ffr"><span class="span3">按钮</span></div><div>圆角空心</div></div>
		<div ng-class="{action:content.purchase_button==8}" ng-click="set_purchase_button(8)"  class="divbox"><div class="ffr"><span class="span4">按钮</span></div><div>半圆角空心</div></div>
		<div ng-class="{action:content.purchase_button==9}" ng-click="set_purchase_button(9)"  class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/99.png"></div><div>不显示</div></div>
	</li>
	<li class="bboder" style="border-bottom: none !important;margin-bottom: 0;">
		<div class="bbleft">角标样式</div>
		<div class="bbright bbflex">
			<span>{{content.subscript_style_name[content.subscript_style-1]}}</span>
			<label></label>
		</div>
	</li>
	<li class="sty2" style="margin-top: 0;margin-bottom: 0;">
		<div  ng-class="{action:content.subscript_style==1}" ng-click="set_subscript_style(1)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/j01.png"></div><div>新品1</div></div>
		<div  ng-class="{action:content.subscript_style==2}" ng-click="set_subscript_style(2)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/j02.png"></div><div>新品2</div></div>
		<div  ng-class="{action:content.subscript_style==3}" ng-click="set_subscript_style(3)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/j03.png"></div><div>热卖1</div></div>
		<div  ng-class="{action:content.subscript_style==4}" ng-click="set_subscript_style(4)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/j04.png"></div><div>热卖2</div></div>
		<div  ng-class="{action:content.subscript_style==5}" ng-click="set_subscript_style(5)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/j05.png"></div><div>自定义</div></div>
		<div  ng-class="{action:content.subscript_style==6}" ng-click="set_subscript_style(6)" class="divbox"><div class="ffr"><img src="/public/static/images/component/purchase/99.png"></div><div>不显示</div></div>
	</li>
	<li class="bboder bboder_t" style="justify-content: flex-start;padding-left: 40px;" ng-if="content.subscript_style==5">
		<img ng-if="content.subscript_diy_style==''" onclick="setuploadimg('','subscript_diy_style',this)" style="width: 40px;height: 40px;" src="/public/static/images/component/seckill/add.png">
		<img ng-if="content.subscript_diy_style" onclick="setuploadimg('','subscript_diy_style',this)" style="width: 40px;height: 40px;" src="{{content.subscript_diy_style}}">
		<sapn>请上传角标图片推荐使用100*100像素的.png图片</sapn>
	</li>
	<li class="bboder" style="margin-bottom: 0px;">
		<div class="bbleft">按钮内容</div>
		<div class="bbright bbflex">
			<span></span>
			<label >
				<input type="text" ng-model="content.button_content" value=""  maxlength="3"/>
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">主图倒角</div>
		<div class="bbright bbflex">
			<span>{{content.chamfer_of_main_drawing_name[content.chamfer_of_main_drawing-1]}}</span>
			<label class="sty3">
				<div ng-click="set_chamfer_of_main_drawing(1)" ng-class="{action:content.chamfer_of_main_drawing==1}"><img  ng-src="{{'/public/static/images/component/info/'+(content.chamfer_of_main_drawing==1 ? 'a01.png':'01.png')}}"></div>
				<div ng-click="set_chamfer_of_main_drawing(2)" ng-class="{action:content.chamfer_of_main_drawing==2}"><img ng-src="{{'/public/static/images/component/info/'+(content.chamfer_of_main_drawing==2 ? 'a02.png':'02.png')}}"></div>
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">图片比例</div>
		<div class="bbright bbflex " >
			<span>{{content.picture_scale_name[content.picture_scale-1]}}</span>
			<label class="sty3">
				<div class="sty3_div_img" ng-click="set_picture_scale(1)" ng-class="{action:content.picture_scale==1}"><img style="width: 40px;" ng-src="{{'/public/static/images/component/info/'+(content.picture_scale==1 ? 'a03.png':'03.png')}}"></div>
				<div class="sty3_div_img" ng-click="set_picture_scale(2)" ng-class="{action:content.picture_scale==2}"><img style="width: 71px;" ng-src="{{'/public/static/images/component/info/'+(content.picture_scale==2 ? 'a04.png':'04.png')}}"></div>
				<div class="sty3_div_img" ng-click="set_picture_scale(3)" ng-class="{action:content.picture_scale==3}"><img ng-src="{{'/public/static/images/component/info/'+(content.picture_scale==3 ? 'a05.png':'05.png')}}"></div>
				<div class="sty3_div_img" ng-click="set_picture_scale(4)" ng-class="{action:content.picture_scale==4}"><img style="width: 34px;" ng-src="{{'/public/static/images/component/info/'+(content.picture_scale==4 ? 'a06.png':'06.png')}}"></div>
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">图片填充</div>
		<div class="bbright bbflex ">
			<span>{{content.picture_fill_name[content.picture_fill-1]}}</span>
			<label class="sty3">
				<div ng-click="set_picture_fill(1)" ng-class="{action:content.picture_fill==1}"><img ng-src="{{'/public/static/images/component/info/'+(content.picture_fill==1 ? 'a07.png':'07.png')}}"></div>
				<div ng-click="set_picture_fill(2)" ng-class="{action:content.picture_fill==2}"><img ng-src="{{'/public/static/images/component/info/'+(content.picture_fill==2 ? 'a08.png':'08.png')}}"></div>
			</label>
		</div>
	</li>

	<li class="bboder bboder_m" >
		<div class="bbleft">文本样式</div>
		<div class="bbright bbflex ">
			<span>{{content.text_style_name[content.text_style-1]}}</span>
			<label class="sty3">
				<div ng-click="set_text_style(1)" ng-class="{action:content.text_style==1}"><img ng-src="{{'/public/static/images/component/info/'+(content.text_style==1 ? 'a09.png':'09.png')}}"></div>
				<div ng-click="set_text_style(2)" ng-class="{action:content.text_style==2}"><img ng-src="{{'/public/static/images/component/info/'+(content.text_style==2 ? 'a10.png':'10.png')}}"></div>
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">文本对齐</div>
		<div class="bbright bbflex">
			<span>{{content.text_align_name[content.text_align-1]}}</span>
			<label class="sty3">
				<div ng-click="set_text_align(1)" ng-class="{action:content.text_align==1}"><img ng-src="{{'/public/static/images/component/info/'+(content.text_align==1 ? 'a11.png':'11.png')}}"></div>
				<div ng-click="set_text_align(2)" ng-class="{action:content.text_align==2}"><img ng-src="{{'/public/static/images/component/info/'+(content.text_align==2 ? 'a12.png':'12.png')}}"></div>
			</label>
		</div>
	</li>
	<li class="bboder bboder_m" >
		<div class="bbleft">页面边距</div>
		<div class="bbright bbflex">
			<div class="container">
				<div class="sliderExample">
					<div ui-slider="{range:'max'}" ng-model="content.page_margins" data-min="0" data-max="20"></div>
					<input readonly="readonly" type="text" ng-model="content.page_margins" style="border: 0;background-color: #fff;" />
				</div>
			</div>
		</div>
	</li>
	<li class="bboder bboder_t" >
		<div class="bbleft">商品间距</div>
		<div class="bbright bbflex">
			<div class="container">
				<div class="sliderExample">
					<div ui-slider="{range:'max'}" ng-model="content.product_spacing" data-min="0" data-max="20"></div>
					<input readonly="readonly" type="text" ng-model="content.product_spacing" style="border: 0;background-color: #fff;" />
				</div>
			</div>
		</div>
	</li>
<!--	<p style="background:#fff;padding-left: 20px;">样式设置</p>-->
<!--	<li>-->
<!--		<label class="col-sm-3">列表样式</label>-->
<!--		<div class="col-sm-8 goodstyle">-->
<!--			<label>-->
<!--				<input type="radio" ng-model="content.style" value="1" name="goodsstyle" /><span>单行滑动</span>-->
<!--			</label>-->
<!--			<label>-->
<!--				<input type="radio" ng-model="content.style" value="2" name="goodsstyle" /><span>列表</span>-->
<!--			</label>-->
<!--		</div>-->
<!--		<div class="clear"></div>-->
<!--	</li>-->
</ul>
<script type="text/javascript">
	//删除
	function delgoods(a, e) {
		e=window.event || e;
		var a =  $(a).parent().index()-1;
		//通过controller来获取Angular应用
		var appElement = document.querySelector('[ng-controller=ctrl]');
		//获取$scope变量
		var $scope = angular.element(appElement).scope();
		$scope.content.data.splice(a, 1);
		//如果想同步到Angular控制器中，则需要调用$apply()方法即可
		$scope.$apply();
		$(".temp5 .round").children("span:last-child").remove();
		e.stopPropagation();
	}
</script>